import BackTop from 'components/content/backtop/BackTop'
import Tools from './tools'

const backTopMixin = {
    components: {
        BackTop
    },
    data() {
        return {
            showBackTop: false
        }
    },
    mounted() {
        // 数据请求回来重新计算高度,防止图片数据加载太快导致没创建scroll元素就去获取该元素上的方法
        let refresh = Tools.debounce(this.$refs.scroll.refresh, 300);
        //监听商品列表加载事件
        this.$bus.$on("goodsItemLoad", () => {
            refresh();
        })
    },
    methods: {
        // 展示回到顶部的小图标
        showBackTopImage(y) {
            // 当元素上拉到1000px位置时展示回到顶部的小图标
            this.showBackTop = y > 1000;
        },

        //点击回到顶部
        backTopClick() {
            this.$refs.scroll.scrollTo(0, 0, 300)
        },


        // 监听元素被滑动后的位置
        getScrollPosition(position) {

            let y = -position.y
            // 回到顶部小图标
            //console.log(y)
            this.showBackTopImage(y);

            // 当选项卡元素上拉到碰到顶部的导航栏时，让吸顶的选项卡展示
            this.isShowTabControl = y >= this.tabControlOffsetTop;
        },


    },
}

export default {
    backTopMixin
}